import React from 'react';
import { Empty, Icon, Table } from 'antd';
import styles from './index.less';
import FormContainer from './FormContainer';

/**
 * 员工档案 - 资产信息 - 虚拟资产(系统账号)
 */
const AssetsSection = ({ formData }) => {
    const columns = [
        {
            title: '系统',
            dataIndex: 'assetName',
            key: 'assetName',
            align: 'center'
        },
        {
            title: '账号',
            dataIndex: 'associateAccountCode',
            key: 'associateAccountCode',
            align: 'center'
        },
        {
            title: '初始密码',
            dataIndex: 'initPwd',
            key: 'initPwd',
            align: 'center'
        },
        {
            title: '操作',
            dataIndex: 'operation',
            key: 'operation',
            align: 'center',
            render: (text, record) => {
                const { associateAccountUrl } = record;
                return associateAccountUrl?.length ? (
                    <a href={record?.associateAccountUrl} target="_blank" rel="noopener noreferrer">
                        <Icon type="link" />
                    </a>
                ) : (
                    '--'
                );
            }
        }
    ];

    // render
    return (
        <FormContainer title="系统账号" hasEditAuth={false}>
            {() =>
                formData?.length ? (
                    <Table
                        rowKey="id"
                        // bordered
                        columns={columns}
                        dataSource={formData}
                        pagination={false}
                        size="small"
                        className={styles.contentTable}
                    />
                ) : (
                    <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
                )
            }
        </FormContainer>
    );
};

export default AssetsSection;
